:root {
    --vp-c-brand: #f03752;
    --vp-button-brand-bg: #f03752;
    --vp-button-brand-border: #f04b22;
    --vp-button-brand-hover-bg: #41b883;
    --vp-button-brand-hover-border: #41b349;
    --vp-button-brand-active-bg: #1e9eb3;
    --vp-button-brand-active-border: #2b73af;

    --code-base: #eef7f2;
    --code-gradient: #fffef9;
    --code-counter: #131124;
    --code-border: #41b349;
}

:root.dark {
    --code-base: #132c33;
    --code-gradient: #1c0d1a;
    --code-counter: #baccd9;
}

html {
    overflow-y: auto;
}

header.VPNav.VPNav {
    width: 100vw;
}

.vp-doc div[class*='language-'] {
    overflow-x: initial;
}

div:not(.language-shell)>pre.shiki {
    position: relative;
    margin: 0;
    padding: 10px 10px 10px 1.25em;
    overflow: auto;
    white-space: pre;
    text-align: left;
    word-break: break-all;
    background: var(--code-base);
    background-image:
        linear-gradient(410deg,
            var(--code-gradient) 25%,
            transparent 25%,
            transparent 75%,
            var(--code-gradient) 75%,
            var(--code-gradient)),
        linear-gradient(410deg,
            var(--code-gradient) 25%,
            transparent 25%,
            transparent 75%,
            var(--code-gradient) 75%,
            var(--code-gradient));
    background-position: 0 0, 2px 2px;
    background-size: 4px 4px;
    border-right: 5px solid var(--code-border);
    border-left: 5px solid var(--code-border);
    border-radius: 5px;
    outline: none;
}

div:not(.language-shell)>pre.shiki::before {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 0.5em;
    padding-right: 0.5em;
    overflow: hidden;
    color: var(--code-counter);
    text-align: right;
    content: "01\A 02\A 03\A 04\A 05\A 06\A 07\A 08\A 09\A 10\A 11\A 12\A 13\A 14\A 15\A 16\A 17\A 18\A 19\A 20\A 21\A 22\A 23\A 24\A 25\A 26\A 27\A 28\A 29\A 30\A 31\A 32\A 33\A 34\A 35\A 36\A 37\A 38\A 39\A 40\A 41\A 42\A 43\A 44\A 45\A 46\A 47\A 48\A 49\A 50\A 51\A 52\A 53\A 54\A 55\A 56\A 57\A 58\A 59\A 60\A 61\A 62\A 63\A 64\A 65\A 66\A 67\A 68\A 69\A 70\A 71\A 72\A 73\A 74\A 75\A 76\A 77\A 78\A 79\A 80\A 81\A 82\A 83\A 84\A 85\A 86\A 87\A 88\A 89\A 90\A 91\A 92\A 93\A 94\A 95\A 96\A 97\A 98\A 99";
}

div:not(.language-shell)>pre.shiki::after {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 1em;
    padding-right: 0.5em;
    border-right: 1px dashed var(--code-counter);
    content: ' \A';
}

.image-container img {
    max-width: 320px;
    max-height: 320px;
}